import 'package:bxultimate/app/theme/app_theme.dart';
import 'package:bxultimate/app/theme/gaps.dart';
import 'package:bxultimate/data/store/config_store.dart';
import 'package:bxultimate/resources/assets.dart';
import 'package:bxultimate/widgets/app/app_title.dart';
import 'package:bxultimate/widgets/mk_load_image.dart';
import 'package:bxultimate/widgets/mk_page.dart';
import 'package:bxultimate/widgets/mk_scroll_view.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:tdesign_flutter/tdesign_flutter.dart';

import 'controller.dart';

class OrganizationApproveDetailPage extends StatefulWidget {
  const OrganizationApproveDetailPage({Key? key}) : super(key: key);

  @override
  State<OrganizationApproveDetailPage> createState() =>
      _OrganizationApproveDetailPageState();
}

class _OrganizationApproveDetailPageState
    extends State<OrganizationApproveDetailPage> {
  final controller = Get.find<OrganizationApproveDetailController>();
  final state = Get.find<OrganizationApproveDetailController>().state;

  @override
  Widget build(BuildContext context) {
    return MkPage(
        child: Scaffold(
      backgroundColor: Colors.transparent,
      appBar: TDNavBar(
        backgroundColor: Colors.transparent,
        title: '审批详情',
      ),
      body: MkScrollView(
        bottomButton: Obx(() => Visibility(
              visible: state.approve.status == -1,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Expanded(
                    child: TDButton(
                      text: '拒绝',
                      isBlock: true,
                      type: TDButtonType.outline,
                      theme: TDButtonTheme.danger,
                      onTap: (){
                        controller.handleApproveClick(2);
                      },
                    ),
                  ),
                  Expanded(
                    child: TDButton(
                      text: '同意',
                      onTap: (){
                        controller.handleApproveClick(1);
                      },
                      isBlock: true,
                      theme: TDButtonTheme.primary,
                    ),
                  ),
                ],
              ),
            )),
        children: [Obx(() => _buildBody())],
      ),
    ));
  }

  _buildHead() {
    return Container(
      margin: EdgeInsets.only(bottom: AppTheme.iDefaultPadding / 2),
      decoration: BoxDecoration(
          color: Colors.white, borderRadius: BorderRadius.circular(8)),
      padding: EdgeInsets.all(AppTheme.iDefaultPadding),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Row(
            children: [
              MkLoadImage(
                Assets.organizationApprove,
                width: 40,
              ),
              Gaps.hGap12,
              Column(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    '${state.approve.applyTypeStr}',
                    style: TextStyle(fontWeight: FontWeight.bold),
                  ),
                  Gaps.vGap4,
                  Text(
                    '${state.approve.submitDate}',
                    style: TextStyle(fontSize: 12, color: Color(0xFF606266)),
                  ),
                ],
              ),
            ],
          ),
          _buildTag()
        ],
      ),
    );
  }

  Widget _buildTag() {
    var theme =
        state.approve.status == 1 ? TDTagTheme.success : TDTagTheme.danger;
    return TDTag(
      '${state.approve.statusStr}',
      theme: theme,
      isOutline: true,
      size: TDTagSize.small,
    );
  }

  _buildReason() {
    return Container(
      margin: EdgeInsets.only(bottom: AppTheme.iDefaultPadding / 2),
      decoration: BoxDecoration(
          color: Colors.white, borderRadius: BorderRadius.circular(8)),
      padding: EdgeInsets.all(AppTheme.iDefaultPadding),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          AppTitle(title: '申请信息'),
          Gaps.vGap8,
          Text(
            '${state.approve.content}',
            style: TextStyle(fontSize: 14, color: Color(0xFF606266)),
          )
        ],
      ),
    );
  }

  _buildFlow() {
    List<TDStepsItemData> vSimpleStepsListData = [];
    if (state.approve.teamAdjustEventList != null) {
      state.approve.teamAdjustEventList!.forEach((element) {
        vSimpleStepsListData.add(TDStepsItemData(
            title: element.remark!,
            customContent: Container(
              margin: EdgeInsets.only(bottom: 12),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Row(
                    children: [
                      ClipRRect(
                          borderRadius: BorderRadius.circular(8),
                          child: MkLoadImage(
                            element.submitUserHeadImg == null
                                ? Assets.imagesIcon
                                : ConfigStore.to.baseFileUrl +
                                    element.submitUserHeadImg,
                            width: 40,
                            height: 40,
                          )),
                      Gaps.hGap8,
                      Text('${element.submitUserName}'),
                    ],
                  ),
                  Text('${element.submitDate}',
                      style: TextStyle(fontSize: 12, color: Color(0xFF606266))),
                ],
              ),
            ),
            content: ''));
      });
    }

    return Container(
      margin: EdgeInsets.only(bottom: AppTheme.iDefaultPadding / 2),
      decoration: BoxDecoration(
          color: Colors.white, borderRadius: BorderRadius.circular(8)),
      padding: EdgeInsets.all(AppTheme.iDefaultPadding),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          AppTitle(title: '审批流程'),
          Gaps.vGap8,
          TDSteps(
            steps: vSimpleStepsListData,
            status: TDStepsStatus.success,
            direction: TDStepsDirection.vertical,
            activeIndex: vSimpleStepsListData.length - 1,
          )
        ],
      ),
    );
  }

  Widget _buildBody() {
    return Container(
      padding: const EdgeInsets.all(AppTheme.iDefaultPadding),
      child: Column(
        children: [
          _buildHead(),
          Gaps.vGap8,
          _buildReason(),
          Gaps.vGap8,
          _buildFlow(),
        ],
      ),
    );
  }

  @override
  void dispose() {
    Get.delete<OrganizationApproveDetailController>();
    super.dispose();
  }
}
